﻿
/**
 * puxu设置菜单配置事件
 * @file
 */
 
 		var lfont = '1px';
		var rfont = '1px';
var ToolEvent = (puxu.ToolEvent = {

	SuccessFun: function (exp, e, z) {
			var me = z;
			
		console.log("111111",exp);
		if (exp == 'insertimage') {
			
		
			z.insertImage = z.id('image_' + z.uid);
				
			var close = z.insertImage.getElementsByClassName('pux-popup')[0];
			//输入连接插入图片
			var url = z.insertImage.getElementsByClassName('pux-insertImageUrl')[0];
			var width = z.insertImage.getElementsByClassName('pux-inputWidth')[0];
			var height = z.insertImage.getElementsByClassName('pux-inputHeight')[0];
			var btn = z.insertImage.getElementsByClassName('pux-btn')[0];
			//绑定输入连接
			btn.onclick = function () {
				var rectangle = z.c('div');
				var img = z.c('img')
				rectangle.appendChild(img);;
				img.src = url.value;
				if (width.value.trim()) img.width = width.value.trim();
				if (height.value.trim()) img.height = height.value.trim();
				z.setHTML(img);
				close.style.display = 'none';
				z.pd();
				pxijs.MoveClass('.Box', z);
			}
			//上传图片
			z.id('imgUpload_' + z.uid).onchange = function () {
				if (!z.options.serverUrl) return alert('请配置uploadUrl项');
				var formData = new FormData();
				for (var i = 0; i < this.files.length; i++) {
					formData.append('file[]', this.files[i]);
				}
				z.ajax({
					url: z.options.serverUrl,
					data: formData,
					success: function (res) {
						if (res) {
							for (var f = 0; f < res.length; f++) {
								if (res[f].error) {
									z.imgUpload.error(res[f], res);
									z.imgUpload.complete(res[f], res);
									alert(res[f].error);
								} else {
									var a = z.c('img');
									a.src = res[f].url;
									z.setHTML(a, true);
									z.imgUpload.success(res[f], res);
									z.imgUpload.complete(res[f], res);
								}
							}
						} else {
							z.imgUpload.error(res);
							z.imgUpload.complete(res);
						}
					}
				});
			}
				
			
		} else if (exp == 'inserttable') {
			//表格
			z.table = z.id('tableId_' + z.uid);
		var tableNum = z.table.getElementsByClassName('pux-tableNum')[0];
			var exeb = z.table.getElementsByClassName('pux-exec');
				 r = 1, c = 1;
			for (var i = 0; i < exeb.length; i++) {
				exeb[i].onmouseover = function (ev) {
			
				var b = this.getAttribute('data').split('|');
				r = b[0];
				c = b[1];
				
				
				
				
				
				
						tableNum.innerHTML = '表格：' + r + "×" + c
				
				}
				exeb[i].onmousedown = function () {
					var tableNode = z.c('table');
					tableNode.width = '100%';
					tableNode.border = 1;
					tableNode.style.border = '1px solid #bdbdbd';
					tableNode.style.borderSpacing = 0;
					tableNode.style.borderCollapse = 'collapse';
					tableNode.className = 'table table-border';
					for (var x = 0; x < c; x++) {
						var trNode = tableNode.insertRow();
						for (var y = 0; y < r; y++) {
							var tdNode = trNode.insertCell();
							tdNode.innerHTML = '<br/>';
						}
					}
					z.setHTML(tableNode, true);
				}
				exeb[i].onmouseout = function () {
					this.onmousemove = null;
					this.onmouseout = null;
				}
			}
			
				
			
		
		} else if (exp == 'inserttextblock') {
		
			var exec = e.getElementsByClassName('pux_lia');
			
			for (var i = 0; i < exec.length; i++) {
				
				exec[i].addEventListener('click', function () {
					var id = Math.round(Math.random()*1000)
					let data = this.getAttribute('data');
					var textdiv = z.c('div');
					textdiv.id="box"+id;
				textdiv.className = "PXtext-" + data + " Box";
					textdiv.innerHTML="请输入内容";
					z.setHTML(textdiv, true);
					pxijs.MoveClass('#'+textdiv.id, z);
					//var range = z.range.getRangeAt(0);
					//console.log(data, z, z.range);
				});
			}
		}	else if (exp == 'backcolor') {
			
			console.log("11111111111111",e);
			var exeb =  e.getElementsByClassName('pux-exec');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () {
					var b = this.getAttribute('data').split('|');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								console.log("me---------------->",me.w_left.document);
								me.w_left.document.execCommand(b[0], false, b[1]);
									
							} else {
								me.w_left.document.execCommand(b[0], false, null);
							}
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_right.document.execCommand(b[0], false, b[1]);
							} else {
								me.w_right.document.execCommand(b[0], false, null);
							}
						}
					
				});
			}
		}else if (exp == 'forecolor') {
			
			
			var exeb =  e.getElementsByClassName('pux-exec');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () {
					
					var b = this.getAttribute('data').split('|');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_left.document.execCommand(b[0], false, b[1]);
							} else {
								me.w_left.document.execCommand(b[0], false, null);
							}
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_right.document.execCommand(b[0], false, b[1]);
							} else {
								me.w_right.document.execCommand(b[0], false, null);
							}
						}
					
				});
			}
		}else if (exp == 'fontsize') {
			
			
			var exeb =  e.getElementsByClassName('pux_lia');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () {
					
					var b = this.getAttribute('data').split('|');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_left.document.execCommand(b[0], false, b[1]);
								lfont = b[1];
							} else {
								me.w_left.document.execCommand(b[0], false, null);
							}
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_right.document.execCommand(b[0], false, b[1]);
								rfont = b[1];
							} else {
								me.w_right.document.execCommand(b[0], false, null);
							}
							
						}
					
				});
			}
		}else if (exp == 'fontfamily') {
			
			
			var exeb =  e.getElementsByClassName('pux_lia');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () {
					
					var b = this.getAttribute('data').split('|');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_left.document.execCommand(b[0], false, b[1]);
							
							} else {
								me.w_left.document.execCommand(b[0], false, null);
							}
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_right.document.execCommand(b[0], false, b[1]);
							} else {
								me.w_right.document.execCommand(b[0], false, null);
							}
						}
					
				});
			}
		}else if (exp == 'addfontsize') {
			
			e.addEventListener('click', function () {
					
					
					
					
					if (puxu.Editarea == 'w_left') {
						
				
						
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							lfont = (parseInt(lfont)+1)+'px';
							me.w_left.document.execCommand("fontSize", false, lfont);
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							rfont = (parseInt(rfont)+1)+'px';
							me.w_right.document.execCommand("fontSize", false, rfont);
						}
					
				});
				
			
		}else if (exp == 'reducefontsize') {
			
			e.addEventListener('click', function () {
					
					
					
					
					if (puxu.Editarea == 'w_left') {
						
				
					
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
						lfont = (parseInt(lfont)-1)+'px';
							me.w_left.document.execCommand("fontSize", false, lfont);
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							rfont = (parseInt(rfont)-1)+'px';
							me.w_right.document.execCommand("fontSize", false, rfont);
						}
					
				});
				
			
		}else if (exp == 'alignment') {
			
			var exeb =  e.getElementsByClassName('pux_lia');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () { 
					
					var b = this.getAttribute('data');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							}
							
								me.w_left.document.execCommand(b, false, true);
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
								me.w_right.document.execCommand(b, false, true);
						}
					
				});
			}
				
			
		}else if (exp == 'wordspacing') {
			
			var exeb =  e.getElementsByClassName('pux_lia');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () { 
					
					var b = this.getAttribute('data-val');
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							} else {
								console.log("字间距",b);
								me.w_left.style.wordSpacing=b;
								
							}
							
								
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
								me.w_right.document.execCommand(b, false, true);
						}
					
				});
			}
		}else if(exp == 'insertshape'){
				var exeb =  e.getElementsByClassName('pux_lia');
		
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () { 
					
					var b = this.getAttribute('data');
					
					if(b=='hr'){
							var rectangle = z.c('div');
					
						var hrh = z.c('hr');
						console.log(hrh);
					hrh.width = '100%';
					//hrh.border = 1;
					rectangle.style.top = startY + 'px';
				    rectangle.style.left = startX + 'px';
					rectangle.style.width = '100%';
					rectangle.className = "box";
					hrh.style.border = '1px solid #000000';
					hrh.className = "box";
					rectangle.appendChild(hrh);
					z.setHTML(rectangle, true);
						pxijs.MoveRectClass('.box', z);
					
					
					
					}
					if(b=='hrvertical'){
						var hrvertical = z.c('hr');
						console.log(hrvertical);
					hrvertical.width = '1px';
					//hrvertical.border = 1;
					hrvertical.size = '100%';
					hrvertical.color = '#000000';
			
						hrvertical.style.margin="0 0 0 10px";
					hrvertical.className = "box";
					z.setHTML(hrvertical, true);
					pxijs.MoveRectClass('.box', z);
					
					}
					if(b=='rectangle'){
						var startX, startY, diffX, diffY;
							startX = e.pageX;
							startY = e.pageY;
						var rectangle = z.c('div');
						var span = z.c('span');
						
								rectangle.id = "active_box";
								rectangle.className = "box";
								rectangle.style.width = '50px';
								rectangle.style.height = '50px';
								rectangle.style.top = startY + 'px';
								rectangle.style.left = startX + 'px';
								rectangle.style.background = '#f2f2f2';
								rectangle.appendChild(span);
									z.setHTML(rectangle, true);
								pxijs.MoveRectClass('.box', z);
								
						
					}
					if(b=='circle'){
						var circle = z.c('div');
						console.log(hrvertical);
					circle.style.width = '50px';
					circle.style.height = '50px';
					circle.style.borderRadius="50%";
					circle.style.background = '#f2f2f2';
					circle.className = "box";
						z.setHTML(circle, true);
						pxijs.MoveRectClass('.box', z);
					
					}
					
				});
			}
				
		}else if(exp=='bordercolor'){
			var exeb =  e.getElementsByClassName('pux-exec');
			console.log(me);
			for (var i = 0; i < exeb.length; i++) {
				
				exeb[i].addEventListener('click', function () { 
					
					var b = this.getAttribute('data').split('|');
					
					if (puxu.Editarea == 'w_left') {
							if (!me.w_left.document._useStyleWithCSS) {
								me.w_left.document.execCommand('styleWithCSS', null, true);
								me.w_left.document._useStyleWithCSS = true;
							} 
							if (b.length > 1) {
								console.log(b);
								me.w_left.document.execCommand(b[0], false, b[1]);
							} else {
								me.w_left.document.execCommand(b[0], false, null);
							}
							
								
							
						} else {
							if (!me.w_right.document._useStyleWithCSS) {
								me.w_right.document.execCommand('styleWithCSS', null, true);
								me.w_right.document._useStyleWithCSS = true;
							}
							if (b.length > 1) {
								me.w_right.document.execCommand(b[0], false, b[1]);
							} else {
							me.w_right.document.execCommand(b[0], false, null);
								
						}
						}
					
				});
			}
		}
		
		
 
		//console.log('SuccessFun=', exp, e, z, z.uid);
    //z.insertImage = z.id('image_' + this.uid);
	},
/**
	 * 设置菜单下拉列表
	 * @method ToolbarsDropdown
	 * @param { String } param 要处理的参数
	 * @return { String } 返回下拉列表值
	 */
	ToolbarsDropdown: function (param) {
		
		let H = '', font = puxu.font;
		switch (param) {
			case 'inserttextblock':
				H = '<ul class="pxul">';
				H += '<li><a class="pux_lia" data="horizontal">水平文本块</a></li>';
				H += '<li><a class="pux_lia" data="vertical">竖值文本块</a></li>';
				H += '</ul>';
				break;
			case 'insertimage':
				H = '<div class="pux-insertImage">';
				H += '<div class="pux-group">';
				H += '<label>URL：</label>';
				H += '<input type="text" class="pux-insertImageUrl" placeholder="网络图片地址" value="" />';
				H += '</div>';
				H += '<div class="pux-group">';
				H += '<label>宽：</label><input type="text" class="pux-inputWidth" placeholder="宽" value="" />';
				H += '<label>高：</label><input type="text" class="pux-inputHeight" placeholder="高" value="" />';
				H += '<a href="javascript:;" class="pux-btn">确定</a>';
				H += '</div>';
				H += '<input type="file" class="pux-uploadInput" id="imgUpload_' + puxu.uid + '" name="file[]" accept="image/*" multiple />';
				H += '<div><img class="pux-uploadIcon" src="' + puxu.options.themePath + 'default/image/uploadIcon.png" /></div>';
				H += '<label for="imgUpload_' + puxu.uid + '" class="pux-uploadBtn">点击上传图片</label>';
				H += '</div>';
				break;
			case 'inserttable':
				H = '<ul class="tableflow pux-tableMain" id="tableId_' + puxu.uid + '"><li>';
				H += '<div class="pux-tableflow">';
			
				H += '<ul    class=" tableBar pux-backColor both">';
				for (var i = 1; i <=10; i++) {
					for(var j= 1 ;j<=10;j++){
					H += '<li><span class="pux-exec"  data="'+j+'|'+i+'" style="border:1px solid #f0f0f0;"></span></li>';
					}
				}
					H += '</ul">';
				H +='</div>';
			
				H += '<div class="pux-tableNum">表格：1×1</div>';
				
				H += '</li></ul>';
				break;
			case 'insertshape':
				H = '<ul class="pxul">';
				H += '<li><a class="pux_lia" data="hr">横向值线</a></li>';
				H += '<li><a class="pux_lia" data="hrvertical">竖向值线</a></li>';
				H += '<li><a class="pux_lia" data="rectangle">矩形</a></li>';
				H += '<li><a class="pux_lia" data="circle">圆形</a></li>';
				H += '</ul>';
				break;
			case 'backcolor':
				H = '<div class="tableflow">';
				H += '<ul class="pux-backColor both">';
				for (var i = 0; i < font.Color.length; i++) {
					H += '<li><span class="pux-exec" data="backColor|' + font.Color[i] + '" style="background-color:' + font.Color[i] + '"></span></li>';
				}
				H += '<li class="pux-menuTitle">填充颜色组件</li>';
				H += '</ul>';
				H += '</div>';
				break;
			case 'bordercolor':
				H = '<div class="tableflow">';
				H += '<ul class="pux-backColor both">';
				for (var i = 0; i < font.Color.length; i++) {
					H += '<li><span class="pux-exec" data="borderColor|' + font.Color[i] + '" style="background-color:' + font.Color[i] + '"></span></li>';
				}
				H += '<li class="pux-menuTitle">边框颜色组件</li>';
				H += '</ul>';
				H += '</div>';
				break;
			case 'hierarchy':
				H = '<ul class="pxul">';
				H += '<li><a class="pux_lia">置于顶层</a></li>';
				H += '<li><a class="pux_lia">上移一层</a></li>';
				H += '<li><a class="pux_lia">下移一层</a></li>';
				H += '<li><a class="pux_lia">置于底层</a></li>';
				H += '</ul>';
				break;
			case 'fontfamily':
				H = '<ul class="pxul ulflow-y icselect" style="max-height:440px;">';
				for (let i = 0; i < font.fontfamily.length; i++) {
					let item = font.fontfamily[i];
					H += '<li><a class="pux_lia" style="font-family:' + item.val + '" data="FontName|' + item.val + '">' + item.name + '</a></li>';
				}
				H += '</ul>';
				break;
			case 'fontsize':
				H = '<ul class="pxul ulflow-y icselect" style="max-height:400px;">';
				for (let i = 1; i < 8; i++) {
					let item = i;
					H += '<li><a class="pux_lia" style="font-size:' + item + 'px" data="fontSize|' + item + 'px">' + item + 'px</a></li>';
				}
				H += '</ul>';
				break;
			case 'forecolor':
				H = '<div class="tableflow">';
				H += '<ul class="pux-backColor both">';
				for (var i = 0; i < font.Color.length; i++) {
					H += '<li><span class="pux-exec" data="foreColor|' + font.Color[i] + '" style="background-color:' + font.Color[i] + '"></span></li>';
				}
				H += '<li class="pux-menuTitle">文字颜色组件</li>';
				H += '</ul>';
				H += '</div>';
				break;
			case 'alignment':
				H = '<ul class="pxul">';
				H += '<li><a class="pux_lia" data="justifyLeft">左对齐</a></li>';
				H += '<li><a class="pux_lia" data="justifyCenter">水平居中</a></li>';
				H += '<li><a class="pux_lia" data="justifyRight">右对齐</a></li>';
				H += '<li><a class="pux_lia" data="">顶部对齐</a></li>';
				H += '<li><a class="pux_lia">垂直居中</a></li>';
				H += '<li><a class="pux_lia">底部对齐</a></li>';
				H += '</ul>';
				break;
			case 'textdirection':
				H = '<ul class="pxul">';
				H += '<li><a class="pux_lia">右开横向</a></li>';
				H += '<li><a class="pux_lia">左开横向</a></li>';
				H += '<li><a class="pux_lia">右开竖向</a></li>';
				H += '<li><a class="pux_lia">左开竖向</a></li>';
				H += '</ul>';
				break;
			case 'wordspacing':
				H = '<ul class="pxul ulflow-y icselect" style="max-height:200px;">';
				for (let i = 0; i < font.letterSpacing.length; i++) {
					let item = font.letterSpacing[i];
					H += '<li><a class="pux_lia" data-val="' + item + 'px">' + item + 'px</a></li>';
				}
				H += '</ul>';
				break;
			case 'lineheight':
				H = '<ul class="pxul ulflow-y icselect" style="max-height:200px;">';
				for (let i = 0; i < font.lineheight.length; i++) {
					let item = font.lineheight[i];
					H += '<li><a class="pux_lia" data-val="' + item + '">' + item + ' 倍行距</a></li>';
				}
				H += '</ul>';
				break; 
			default:
				return '';
		}
		return H;
	},
	/**
	 * 设置菜单弹出窗口配置内容
	 * @method PopupContent
	 * @param { String } param 要处理的参数
	 * @return { String } 返回弹出窗口配置内容
	 */
	PopupContent: function (param) {
		let Em = {};
		switch (param) {
			case 'insertimage':
				Em = { width: 320, height: 280, title: '图片上传', content: this.ToolbarsDropdown('insertimage') };
				break;
			default:
				return {};
		}
		return Em;
	}

});